﻿<template>
    <div id="app">

        <Row style="padding:40px;">
            <Row>
                <p style="font-size:30px;text-align:center;">选择您的身份</p>
            </Row>
            <hr style="margin-top:10px;" />
            <Row style="margin-top:30px">
                <Col span="24" style="text-align:center">
                <img src="../assets/images/teacher.png" width="50%" @click="choosetype(1)" />
                </Col>
                <Col span="24" style="text-align:center;line-height:25px;vertical-align:middle">

                <img src="../assets/images/check_02.png" v-if="type==1" style="width:20px;height:20px;vertical-align: middle;" />
                <img src="../assets/images/check_01.png" v-else="type==0" style="width:20px;height:20px;vertical-align: middle;" />
                &nbsp;&nbsp;我是老师
                </Col>
            </Row>
            <Row style="margin-top:30px">
                <Col span="24" style="text-align:center">
                <img src="../assets/images/babamama.png" width="50%" @click="choosetype(2)" />
                </Col>
                <Col span="24" style="text-align:center;line-height:25px;vertical-align:middle">

                <img src="../assets/images/check_02.png" v-if="type==2" style="width:20px;height:20px;vertical-align: middle;" />
                <img src="../assets/images/check_01.png" v-else="type==0" style="width:20px;height:20px;vertical-align: middle;" />
                &nbsp;&nbsp;我是家长
                </Col>
            </Row>
            <Row style="margin-top:30px">
                <Button type="button" style="width:100%;background-color:#f89225;border-radius: 10px;color:#ffffff" @click="next">下一步</Button>
            </Row>
        </Row>
    </div>
</template>

<script>
    import { Toast } from 'mint-ui';
    export default {
        name: 'app',
        data() {
            return {
                type: 0
            }
        },
        methods:
        {
            load: function () {

            },
            choosetype: function (index) {

                var _this = this;


                if (index == 1) {

                    _this.$data.type = 1;
                    // _this.$router.push({ name: 'teacherbind', params: {} });

                } else if (index == 2) {

                    _this.$data.type = 2;
                    // _this.$router.push({ name: 'studentbind', params: {} });
                }
            },
            next: function () {
                var type = this.$data.type;
                if (type == 0) {
                    Toast("请选择身份");
                } else if (type == 1) {
                    this.$router.push({ name: 'teacherbind', params: {} });
                } else if (type == 2) {
                    this.$router.push({ name: 'studentbind', params: {} });
                }
            }
        },
        created: function () {
            this.load();

        }
    }
</script>

<style scoped>
</style>